<template>
    <div class="checkInfo">
        <el-form ref="AddCheckRef" style="max-width: 600px" :model="checkInfo" label-width="auto" class="demo-ruleForm"
            :size="formSize" status-icon>
                    <el-form-item label="检查单号" prop="id">
                        <el-input v-model="checkInfo.id" disabled />
                    </el-form-item>
                    <el-form-item label="车辆id" prop="carId">
                        <el-input v-model="checkInfo.carId" disabled />
                    </el-form-item>
                    <el-form-item label="订单号" prop="orderId">
                        <el-input v-model="checkInfo.orderId" disabled />
                    </el-form-item>
                    <el-form-item label="异常信息" prop="error">
                        <el-input v-model="checkInfo.error" placeholder="请输入异常信息" />
                    </el-form-item>
                    <el-form-item label="评分" prop="score">
                        <el-input v-model="checkInfo.score" placeholder="请输入评分" />
                    </el-form-item>
                    <el-form-item style="display: flex; justify-content: center;" >
                        <el-button type="primary" @click="submitForm(AddCheckRef)">保存</el-button>
                    </el-form-item>
        </el-form>
    </div>
</template>

<script lang="ts" setup>
import { reactive, ref, onMounted } from 'vue'
import type { ComponentSize, FormInstance, FormRules,} from 'element-plus'
import { getCheckById, updateCar, updateCheck, updateOrder } from '@/api'
import { ElMessage } from 'element-plus'
import router from '@/router'
import { useRoute } from 'vue-router';
import CarInfo from '@/views/CarInfo.vue'

const formSize = ref<ComponentSize>('default')
const AddCheckRef = ref<FormInstance>()
let checkInfo = reactive({
    id: '',
    carId: '',
    orderId: '',
    error: '',
    score: 0,
    status: '',
})

let orderInfo = reactive({
    id: '',
    status: '2',
    deductionDeposit: 0
})

let carInfo = reactive({
    id: '',
    state: '0'
})


const id = ref()

// 在组件挂载时初始化数据
onMounted(() => {
    const route = useRoute();
    // 获取查询参数
    id.value = route.query.id as string | undefined;
    if(id.value){
        // 发送请求 根据id查数据
        getCheckById(id.value).then((resp: { data: any; }) => {
            let data = resp.data;
            if (data.code == '50041') {
                Object.assign(checkInfo, data.data);
            } else {
                ElMessage({
                    message: data.message,
                    type: 'error'
                });
            }
        });
    }
});

const submitForm = async (formEl: FormInstance | undefined) => {
    if (!formEl) return
    await formEl.validate((valid, fields) => {
        if (valid) {
            if(id.value){
                checkInfo.status='1';
                updateCheck(checkInfo).then((resp: { data: any; }) => {
                    let data = resp.data;
                    if (data.code == '50031') {
                        ElMessage({
                            message: data.message,
                            type: 'success'
                        });
                        orderInfo.id = checkInfo.orderId
                        updateOrder(orderInfo).then((resp: {data : any;}) => {
                            let data = resp.data;
                            if (data.code == '50031') {
                                ElMessage({
                                    message: data.message,
                                    type: 'success'
                                });
                                carInfo.id = checkInfo.carId
                                updateCar(carInfo).then((resp: {data : any;}) => {
                                    let data = resp.data;
                                    if (data.code == '50031') {
                                        ElMessage({
                                            message: data.message,
                                            type: 'success'
                                        });
                                    }else{
                                        ElMessage({
                                            message: data.message,
                                            type: 'error'
                                        });
                                    }
                                })
                            }else{
                                ElMessage({
                                    message: data.message,
                                    type: 'error'
                                });
                            }
                        })
                        // 发送消息给父窗口，告知要改变页面
                        window.parent.postMessage({ action: 'changePage', url: '/#/check/list' }, '*');
                    } else {
                        ElMessage({
                            message: data.message,
                            type: 'error'
                        });
                    }
                });
            }
        } else {
            console.log('error submit!', fields)
        }
    })
}


const options = Array.from({ length: 10000 }).map((_, idx) => ({
    value: `${idx + 1}`,
    label: `${idx + 1}`,
}))
</script>

<style scoped>
.checkInfo {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
    box-sizing: border-box;
}
</style>